<!DOCTYPE html>
<html lang="en">
<head>
    <title>模板管理平台</title>
    <#include "/include/header.ftl">
</head>
<body class="loginBody">
<!--header-->
<div class="login-header">
    <div class="loginbox">
        <div class="page-cell">
            <div class="page-cell__bd"><img src="/static/images/logo.jpg"/></div>
            <div class="page-cell__ft" style="display: none;">
                <img src="/static/images/kf-icon.jpg">
                <div class="cont">
                    <p>全国客服电话</p>
                    <p>0755-36806888</p>
                </div>
            </div>
        </div>
    </div>
</div>

<!--login box-->
<div class="loginCont">
    <div class="loginbox">
        <div class="login-pic">
            <img src="/static/images/login-pic.png"/>
        </div>
        <div class="loginform">
            <h3>模板管理平台</h3>
            <div class="loginList">
                <form class="layui-form">
                    <label>
                        <span class="pic"><img src="/static/images/login-user.png"/></span>
                        <input type="text" id="userName" class="layui-input" placeholder="请输入用户名" lay-verify="loginUser" lay-verType="tips"/>
                    </label>
                    <label>
                        <span class="pic"><img src="/static/images/login-passwrod.png"/></span>
                        <input type="password" id="userPassword" class="layui-input" placeholder="请输入密码" lay-verify="loginPassword" lay-verType="tips"/>
                    </label>
                    <label style="margin-bottom:20px;">
                        <span class="pic"><img src="/static/images/login-verification.png"/></span>
                        <input type="password" id="code" class="layui-input" placeholder="请输入验证码" lay-verify="loginCode" lay-verType="tips"/>
                        <img src="/static/images/login-code.png" class="loginCode"/>
                    </label>
                    <input type="checkbox" title="记住密码" lay-skin="primary"/>
                    <button type="submit" lay-submit="" id="submitBtn"  lay-filter="submitBtn" class="btn btn-Orange">登录</button>
                </form>
            </div>
        </div>
    </div>
</div>



<!--copyright-->
<#include "/include/footer.ftl">



<script type="text/javascript">
    layui.use(['form','code'], function(){
        form = layui.form;layui.code();
        /*登录框居中*/
        $(window).resize(function(){
            $('.loginCont').css({
                position:'absolute',
                left: ($(window).width() - $('.loginCont').outerWidth())/2,
                top: ($(window).height() - $('.loginCont').outerHeight())/2+ $(document).scrollTop()
            });
        });
        //初始化函数
        $(window).resize();


        //表单验证
        top.form.verify({
            loginUser: function(value){
                if(value==''){
                    return '<img src="/static/images/warning.png"/>账号不能为空';

                }
            },
            loginPassword:function (value) {
                if(value==''){
                    return '<span class="warning-1"><img src="/static/images/warning.png"/>密码不能为空</span>';
                }
            },
            loginCode:function (value) {
                if(value==''){
                    return '<span class="warning-2"><img src="/static/images/warning.png"/>验证码不能为空</span>';
                }
            }

        });
        top.form.on('submit(submitBtn)', function (data) {
            top.layer.msg("<img src='/static/images/success.png'/><span>登录成功！</span>",{
                skin:'layerMsg',
                time:2000,
                end:function () {
                    //结束后回调
                    window.location='/home'
                }
            });
            return false;
        });

    });


    $(document).keydown(function (e) {
        if (e.keyCode === 13) {
            $("#submitBtn").trigger("click");
        }
    });

</script>
</body>
</html>
